<template>
  <div>
  <h1>主页面</h1>
  <!-- <a-button type="primary" @click="to">跳转</a-button> -->
  <!-- <router-view></router-view> -->
   <Test1 :columns="columns" :tableData="tableData" @handleDel="handleDel" @handleEdit="handleEdit"></Test1>
    <Model :visible="visible" @closeModel = "closeModel" :Title="Title" :rowData="rowData"></Model>
</div>
</template>

<script>
import Test1 from './Test1.vue';
import Model from './Model.vue';
export default {
name:'viewPage',
components:{
  Test1,
  Model
},
data(){
  return{
    columns: [
    {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
    scopedSlots: { customRender: 'name' },
  },
  {
    title: '成绩',
    children:[
      {
        title: '语文',
            width: 100,
            dataIndex: 'Chinese',
            name: 'Chinese',
            scopedSlots: { customRender: 'Chinese' }
      },
      {
        title: '数学',
            width: 100,
            dataIndex: 'Math',
            name: 'Math',
            scopedSlots: { customRender: 'Math' }
      }
    ]
  },
  {
    title: 'Age',
    dataIndex: 'age',
    key: 'age',
    width: 80,
  },
  {
    title: 'Address',
    dataIndex: 'address',
    key: 'address 1',
    ellipsis: true,
  },
  {
    title: '爱好',
    dataIndex: 'hobbyName',
    key: 'hobbyName',
    dicData:[
    { label: '唱', value: '01' },
            { label: '跳', value: '02' },
            { label: 'rap', value: '03' },
            { label: '篮球', value: '04' }
    ]
  },
  {
    title: 'Action',
    key: 'action',
    scopedSlots: { customRender: 'action' },
  },
    ],
    tableData:[
  {
    key: '1',
    name: 'John Brown',
    age: 32,
    address: 'New York No. 1 Lake Park, New York No. 1 Lake Park',
    hobbyName: '唱',
    Math:80,
    Chinese:80,
    tags: ['nice', 'developer'],
  },
  {
    key: '2',
    name: 'Jim Green',
    age: 42,
    address: 'London No. 2 Lake Park, London No. 2 Lake Park',
    hobbyName: '跳',
    tags: ['loser'],
  },
  {
    key: '3',
    name: 'Joe Black',
    age: 32,
    address: 'Sidney No. 1 Lake Park, Sidney No. 1 Lake Park',
    hobbyName: 'rap',
    tags: ['cool', 'teacher'],
  },
  {
    key: '4',
    name: 'ikun',
    age: 18,
    address: 'Sidney No. 1 Lake Park, Sidney No. 1 Lake Park',
    hobbyName: '篮球',
    tags: ['cool', 'teacher'],
  },
],
visible: false,
Title: '查看',
rowData:{}
  }
},
methods:{
  to(){
    this.$router.push('/test')
  },
  handleDel(val){
    console.log(val)
    // 方法1
  this.tableData = this.tableData.filter(item => item.key !== val.key)
  this.$message.success('删除成功')
  // 方法二
//   for(let i= 0; i < this.tableData.length ; i++){
//    if(this.tableData[i].key === val.key){
//    this.tableData.splice(i,1)
//    break
//   }
// }  
// 方法三
// const index = array.findIndex(item => item.key === keyToRemove);  
//   if (index > -1) {  
//     array.splice(index, 1);  
//   }  
  console.log(this.tableData, 'this.tableData')
},
handleEdit(val){
  console.log(val, 'Edit')
  this.visible = true
  this.rowData = val
  console.log(this.rowData)
},
closeModel(){
  this.visible = false
}
  }
}
</script>

<style>

</style>